<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
	<title>Update from JSON</title>
	
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<link rel="stylesheet" type="text/css" href="../../../codebase/dhtmlx.css"/>
	<script src="../../../codebase/dhtmlx.js"></script>
</head>

<body>
	
	<h1>Update from JSON</h1>
	<p>Grid allows to update data from JSON</p>
	
	<div id="gridbox" style="width:500px; height:270px; background-color:white;"></div>
	
      <input type='button' onclick='mygrid.updateFromJSON("../common/update.json", false, false)' value='update from JSON'><br>
      <input type='button' onclick='mygrid.updateFromJSON("../common/update.json", "top")' value='update from JSON (add)'><br>
      <input type='button' onclick='mygrid.updateFromJSON("../common/update.json", true, true)' value='update from JSON (remove)'>

<script>
data={
rows:[
    { id:1001, 
 data:[
      "100",
      "A Time to Kill",
      "John Grisham",
      "12.99",
      "1",
      "05/01/1998"] },
   { id:1002, 
 data:[
      "1000",
      "Blood and Smoke",
      "Stephen King",
      "0",
      "1",
      "01/01/2000"] },
   { id:1003, 
 data:[
      "-200",
      "The Rainmaker",
      "John Grisham",
      "7.99",
      "0",
      "12/01/2001"] },
   { id:1004, 
 data:[
      "350",
      "The Green Mile",
      "Stephen King",
      "11.10",
      "1",
      "01/01/1992"] },
   { id:1005, 
 data:[
      "700",
      "Misery",
      "Stephen King",
      "7.70",
      "0",
      "01/01/2003"] },
   { id:1006, 
 data:[
      "-1200",
      "The Dark Half",
      "Stephen King",
      "0",
      "0",
      "10/30/1999"] },
   { id:1007, 
 data:[
      "1500",
      "The Partner",
      "John Grisham",
      "12.99",
      "1",
      "01/01/2005"] },
   { id:1008, 
 data:[
      "500",
      "It",
      "Stephen King",
      "9.70",
      "0",
      "10/15/2001"] },
   { id:1009, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },
   { id:10010, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },
    { id:1011, 
 data:[
      "101",
      "A Time to Kill",
      "John Grisham",
      "12.99",
      "1",
      "05/01/1998"] },
   { id:1012, 
 data:[
      "1000",
      "Blood and Smoke",
      "Stephen King",
      "0",
      "1",
      "01/01/2000"] },
   { id:1013, 
 data:[
      "-200",
      "The Rainmaker",
      "John Grisham",
      "7.99",
      "0",
      "12/01/2001"] },
   { id:1014, 
 data:[
      "350",
      "The Green Mile",
      "Stephen King",
      "11.10",
      "1",
      "01/01/1992"] },
   { id:1015, 
 data:[
      "700",
      "Misery",
      "Stephen King",
      "7.70",
      "0",
      "01/01/2003"] },
   { id:1016, 
 data:[
      "-1200",
      "The Dark Half",
      "Stephen King",
      "0",
      "0",
      "10/30/1999"] },
   { id:1017, 
 data:[
      "1500",
      "The Partner",
      "John Grisham",
      "12.99",
      "1",
      "01/01/2005"] },
   { id:1018, 
 data:[
      "500",
      "It",
      "Stephen King",
      "9.70",
      "0",
      "10/15/2001"] },
   { id:1019, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },
   { id:10110, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },

    

    { id:1021, 
 data:[
      "102",
      "A Time to Kill",
      "John Grisham",
      "12.99",
      "1",
      "05/01/1998"] },
   { id:1022, 
 data:[
      "1000",
      "Blood and Smoke",
      "Stephen King",
      "0",
      "1",
      "01/01/2000"] },
   { id:1023, 
 data:[
      "-200",
      "The Rainmaker",
      "John Grisham",
      "7.99",
      "0",
      "12/01/2001"] },
   { id:1024, 
 data:[
      "350",
      "The Green Mile",
      "Stephen King",
      "11.10",
      "1",
      "01/01/1992"] },
   { id:1025, 
 data:[
      "700",
      "Misery",
      "Stephen King",
      "7.70",
      "0",
      "01/01/2003"] },
   { id:1026, 
 data:[
      "-1200",
      "The Dark Half",
      "Stephen King",
      "0",
      "0",
      "10/30/1999"] },
   { id:1027, 
 data:[
      "1500",
      "The Partner",
      "John Grisham",
      "12.99",
      "1",
      "01/01/2005"] },
   { id:1028, 
 data:[
      "500",
      "It",
      "Stephen King",
      "9.70",
      "0",
      "10/15/2001"] },
   { id:1029, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },
   { id:10210, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },

    

    { id:1031, 
 data:[
      "103",
      "A Time to Kill",
      "John Grisham",
      "12.99",
      "1",
      "05/01/1998"] },
   { id:1032, 
 data:[
      "1000",
      "Blood and Smoke",
      "Stephen King",
      "0",
      "1",
      "01/01/2000"] },
   { id:1033, 
 data:[
      "-200",
      "The Rainmaker",
      "John Grisham",
      "7.99",
      "0",
      "12/01/2001"] },
   { id:1034, 
 data:[
      "350",
      "The Green Mile",
      "Stephen King",
      "11.10",
      "1",
      "01/01/1992"] },
   { id:1035, 
 data:[
      "700",
      "Misery",
      "Stephen King",
      "7.70",
      "0",
      "01/01/2003"] },
   { id:1036, 
 data:[
      "-1200",
      "The Dark Half",
      "Stephen King",
      "0",
      "0",
      "10/30/1999"] },
   { id:1037, 
 data:[
      "1500",
      "The Partner",
      "John Grisham",
      "12.99",
      "1",
      "01/01/2005"] },
   { id:1038, 
 data:[
      "500",
      "It",
      "Stephen King",
      "9.70",
      "0",
      "10/15/2001"] },
   { id:1039, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },
   { id:10310, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },

    

    { id:1041, 
 data:[
      "104",
      "A Time to Kill",
      "John Grisham",
      "12.99",
      "1",
      "05/01/1998"] },
   { id:1042, 
 data:[
      "1000",
      "Blood and Smoke",
      "Stephen King",
      "0",
      "1",
      "01/01/2000"] },
   { id:1043, 
 data:[
      "-200",
      "The Rainmaker",
      "John Grisham",
      "7.99",
      "0",
      "12/01/2001"] },
   { id:1044, 
 data:[
      "350",
      "The Green Mile",
      "Stephen King",
      "11.10",
      "1",
      "01/01/1992"] },
   { id:1045, 
 data:[
      "700",
      "Misery",
      "Stephen King",
      "7.70",
      "0",
      "01/01/2003"] },
   { id:1046, 
 data:[
      "-1200",
      "The Dark Half",
      "Stephen King",
      "0",
      "0",
      "10/30/1999"] },
   { id:1047, 
 data:[
      "1500",
      "The Partner",
      "John Grisham",
      "12.99",
      "1",
      "01/01/2005"] },
   { id:1048, 
 data:[
      "500",
      "It",
      "Stephen King",
      "9.70",
      "0",
      "10/15/2001"] },
   { id:1049, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },
   { id:10410, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },

    

    { id:1051, 
 data:[
      "105",
      "A Time to Kill",
      "John Grisham",
      "12.99",
      "1",
      "05/01/1998"] },
   { id:1052, 
 data:[
      "1000",
      "Blood and Smoke",
      "Stephen King",
      "0",
      "1",
      "01/01/2000"] },
   { id:1053, 
 data:[
      "-200",
      "The Rainmaker",
      "John Grisham",
      "7.99",
      "0",
      "12/01/2001"] },
   { id:1054, 
 data:[
      "350",
      "The Green Mile",
      "Stephen King",
      "11.10",
      "1",
      "01/01/1992"] },
   { id:1055, 
 data:[
      "700",
      "Misery",
      "Stephen King",
      "7.70",
      "0",
      "01/01/2003"] },
   { id:1056, 
 data:[
      "-1200",
      "The Dark Half",
      "Stephen King",
      "0",
      "0",
      "10/30/1999"] },
   { id:1057, 
 data:[
      "1500",
      "The Partner",
      "John Grisham",
      "12.99",
      "1",
      "01/01/2005"] },
   { id:1058, 
 data:[
      "500",
      "It",
      "Stephen King",
      "9.70",
      "0",
      "10/15/2001"] },
   { id:1059, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },
   { id:10510, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },

    

    { id:1061, 
 data:[
      "106",
      "A Time to Kill",
      "John Grisham",
      "12.99",
      "1",
      "05/01/1998"] },
   { id:1062, 
 data:[
      "1000",
      "Blood and Smoke",
      "Stephen King",
      "0",
      "1",
      "01/01/2000"] },
   { id:1063, 
 data:[
      "-200",
      "The Rainmaker",
      "John Grisham",
      "7.99",
      "0",
      "12/01/2001"] },
   { id:1064, 
 data:[
      "350",
      "The Green Mile",
      "Stephen King",
      "11.10",
      "1",
      "01/01/1992"] },
   { id:1065, 
 data:[
      "700",
      "Misery",
      "Stephen King",
      "7.70",
      "0",
      "01/01/2003"] },
   { id:1066, 
 data:[
      "-1200",
      "The Dark Half",
      "Stephen King",
      "0",
      "0",
      "10/30/1999"] },
   { id:1067, 
 data:[
      "1500",
      "The Partner",
      "John Grisham",
      "12.99",
      "1",
      "01/01/2005"] },
   { id:1068, 
 data:[
      "500",
      "It",
      "Stephen King",
      "9.70",
      "0",
      "10/15/2001"] },
   { id:1069, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },
   { id:10610, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },

    

    { id:1071, 
 data:[
      "107",
      "A Time to Kill",
      "John Grisham",
      "12.99",
      "1",
      "05/01/1998"] },
   { id:1072, 
 data:[
      "1000",
      "Blood and Smoke",
      "Stephen King",
      "0",
      "1",
      "01/01/2000"] },
   { id:1073, 
 data:[
      "-200",
      "The Rainmaker",
      "John Grisham",
      "7.99",
      "0",
      "12/01/2001"] },
   { id:1074, 
 data:[
      "350",
      "The Green Mile",
      "Stephen King",
      "11.10",
      "1",
      "01/01/1992"] },
   { id:1075, 
 data:[
      "700",
      "Misery",
      "Stephen King",
      "7.70",
      "0",
      "01/01/2003"] },
   { id:1076, 
 data:[
      "-1200",
      "The Dark Half",
      "Stephen King",
      "0",
      "0",
      "10/30/1999"] },
   { id:1077, 
 data:[
      "1500",
      "The Partner",
      "John Grisham",
      "12.99",
      "1",
      "01/01/2005"] },
   { id:1078, 
 data:[
      "500",
      "It",
      "Stephen King",
      "9.70",
      "0",
      "10/15/2001"] },
   { id:1079, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },
   { id:10710, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },

    

    { id:1081, 
 data:[
      "108",
      "A Time to Kill",
      "John Grisham",
      "12.99",
      "1",
      "05/01/1998"] },
   { id:1082, 
 data:[
      "1000",
      "Blood and Smoke",
      "Stephen King",
      "0",
      "1",
      "01/01/2000"] },
   { id:1083, 
 data:[
      "-200",
      "The Rainmaker",
      "John Grisham",
      "7.99",
      "0",
      "12/01/2001"] },
   { id:1084, 
 data:[
      "350",
      "The Green Mile",
      "Stephen King",
      "11.10",
      "1",
      "01/01/1992"] },
   { id:1085, 
 data:[
      "700",
      "Misery",
      "Stephen King",
      "7.70",
      "0",
      "01/01/2003"] },
   { id:1086, 
 data:[
      "-1200",
      "The Dark Half",
      "Stephen King",
      "0",
      "0",
      "10/30/1999"] },
   { id:1087, 
 data:[
      "1500",
      "The Partner",
      "John Grisham",
      "12.99",
      "1",
      "01/01/2005"] },
   { id:1088, 
 data:[
      "500",
      "It",
      "Stephen King",
      "9.70",
      "0",
      "10/15/2001"] },
   { id:1089, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },
   { id:10810, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },

    

    { id:1091, 
 data:[
      "109",
      "A Time to Kill",
      "John Grisham",
      "12.99",
      "1",
      "05/01/1998"] },
   { id:1092, 
 data:[
      "1000",
      "Blood and Smoke",
      "Stephen King",
      "0",
      "1",
      "01/01/2000"] },
   { id:1093, 
 data:[
      "-200",
      "The Rainmaker",
      "John Grisham",
      "7.99",
      "0",
      "12/01/2001"] },
   { id:1094, 
 data:[
      "350",
      "The Green Mile",
      "Stephen King",
      "11.10",
      "1",
      "01/01/1992"] },
   { id:1095, 
 data:[
      "700",
      "Misery",
      "Stephen King",
      "7.70",
      "0",
      "01/01/2003"] },
   { id:1096, 
 data:[
      "-1200",
      "The Dark Half",
      "Stephen King",
      "0",
      "0",
      "10/30/1999"] },
   { id:1097, 
 data:[
      "1500",
      "The Partner",
      "John Grisham",
      "12.99",
      "1",
      "01/01/2005"] },
   { id:1098, 
 data:[
      "500",
      "It",
      "Stephen King",
      "9.70",
      "0",
      "10/15/2001"] },
   { id:1099, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] },
   { id:10910, 
 data:[
      "400",
      "Cousin Bette",
      "Honore de Balzac",
      "0",
      "1",
      "12/01/1991"] }
      ]
}
	mygrid = new dhtmlXGridObject('gridbox');
	mygrid.setImagePath('../../../codebase/imgs/');
	mygrid.setHeader("Sales, Book Title, Author");
	mygrid.setInitWidths("70,250,*")
	mygrid.setColAlign("right,left,left")
	mygrid.setColTypes("dyn,ed,ed");
	mygrid.setColSorting("int,str,str")
	mygrid.init();
	mygrid.setSkin("dhx_skyblue")
	mygrid.load("../common/data.json","json");
</script>

</body>
</html>
